<!DOCTYPE html>
<html>

	<head>
		<title>servers-area.html</title>
		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="this is my page">
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">
		<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
		<link rel="stylesheet" href="../layui/css/layui.css" type="text/css"></link>
		<script type="text/javascript" src="../js/util/jquery.js"></script>
		<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery.form/3.51/jquery.form.min.js"></script>
		<script type="text/javascript" src="../layui/layui.all.js"></script>
		<script type="text/javascript" src="../js/data/manager/province-data.js"></script>
		<!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
		<!--[if lt IE 9]>
	  <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
	  <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
	<![endif]-->
	 <script type="text/javascript" src="../js/util/rollups/tripledes.js" ></script>
    <script type="text/javascript" src="../js/util/components/mode-ecb.js" ></script>
    <script type="text/javascript" src="../js/util/FrameOption.js"></script>
		<style type="text/css">
			.row-div-mian {
				margin-left: 30px;
				margin-top: 20px;
			}
			.row-div-three {
				margin-left: 15px;
				margin-top: 20px;
				float: left;
			}
			
			.row-div-three-button {
				width: 150px;
				float: left;
			}
			
			.row-div-three-select {
				width: 80px;
				float: left;
				margin-left: 10px;
			}
			
			.row-div-three-select-option {
				width: 80px;
				height: 38px;
				color: rgba(84, 100, 120, 0.9);
				border-color: rgba(84, 100, 120, 0.2);
			}
			
			.row-div-three-left {
				float: left;
			}
			
			.row-div-three-query {
				float: left;
				margin-left: 10px;
			}
			
			.row-div-four {
				margin-left: 30px;
				margin-top: 20px;
				border: 0px;
				width: 97%;
			}
		</style>
		<script type="text/javascript" src="../js/util/arttemplate.js"></script>

		<script type="text/javascript" src="../js/util/FrameOption.js"></script>
		<!-- <script type="text/javascript" src="http://echarts.baidu.com/examples/vendors/jquery/jquery.js"></script> -->
		<!--   <script src="http://mockjs.com/dist/mock.js"></script> -->
		<script type="text/javascript" src="../js/util/page_head_main.js"></script>
	</head>

	<body>
		<div style="width: 100%;float: left;">
			<div class="row-div-mian" id="headDiv">

			</div>
		</div>
		<!-- <div style="width: 100%;float: left;" >
 			<div style="float: left;margin-left: 30px;margin-top: 20px">
  				<span>区域</span>
  			</div> 
  			<div class="row-div-one" id="areaOldHtml">
  			</div>
  		</div> -->
		<div style="width: 100%;float: left;">
			<div style="float: left;margin-left: 30px;margin-top: 20px">
				<span>项目</span>
			</div>
			<div class="row-div-three">

				<div class="row-div-three-query">
					<button class="layui-btn layui-btn-primary layui-btn-sm" style="height: 38px;">/resourceApi</button>
				</div>
				<div class="row-div-three-query">
					<button class="layui-btn layui-btn-primary layui-btn-sm" style="height: 38px;">/manager</button>
				</div>

			</div>
		</div>
		<div style="width: 100%;float: left;">
			<div style="margin-top: 30px;margin-left: 30px;float: left;width: 100%;height: 670px;" class="">
				<div style="float: left; width: 310px;height: 100%;"  >
					<div>
						<div class="layui-input-inline">
				            <input type="text"  id="searchAs" onkeydown="seachsKey()" name="searchAs" required="" lay-verify="required" lay-vertype="tips" placeholder="类名，类url，方法url，类描述，方法描述" autocomplete="off" class="layui-input" style="width: 155%;">
				         </div>
				         <div class="layui-form-mid layui-word-aux">
				         	<a href="javascript:(0)" onclick="searchInfo()">
						 		<i class="layui-icon layui-icon-search"></i>
						 	</a>
				         </div>
					</div>
					<div>
						<table class="layui-hide" lay-skin="line" id="test" lay-filter="test"></table>						
					</div>
				</div>
				
				<div style="float: left;border: 1px solid #C9C5C5;height:100%;width:78%;margin-left: 10px;overflow: auto;" id="HtmlBean" >
					 
					 
				</div>
			</div>		
		</div>
		<div style="width: 100%;float: left;">
			<div class="row-div-four">
				 
				<!-- <div style="height:30px;border-bottom:1px solid rgba(84,100,120,0.2) " >  <span>应用查看：</span> <a href="javascript:(0)" onclick="clickApplication(1)"><span class="layui-badge" id="applicationNum">0</span></a> </div> -->
				<!-- <div id="test1"> </div> -->
			</div>
		</div>
 		<div id="interfacesTest" style="display: none;">
		 	 
		 </div>
	</body>

	<script type="text/html" id="templateHead">
		<span>
				 <a href="javascript:void(0)" onclick="clickServers()" style="color: #999!important;">接口</a>-
				 <a href="#" > <$=data$></a>
				 <a href="" style="margin-left: 5px;">
				  	<i class="layui-icon layui-anim layui-anim-rotate ">ဂ</i>
				 </a> 
			</span>
	</script>
	<script type="text/html" id="templetManager">
		<div style="float:left">
			<a href="javascript:(0)" style="color:blue">管理</a>
		</div>
		<div style="float:left;margin-left:10px">
			<a href="javascript:(0)" style="color:blue " onclick="updateServers('{{d.id}}')">修改</a>
		</div>
		<div style="float:left;margin-left:10px">
			<a href="javascript:(0)" style="color:blue ">绑定应用</a>
		</div>
	</script>
	
	<script type="text/html" id="templetBean">
		<div style="font-size:16px;margin-left: 10px;margin-top: 10px;" >
		
			<div style="">
				<table>
				<tr>
					<td width="100">类名: </td>
					<td width="100"></td>
					<td><a href="javascript:(0)" style="color:blue"><$=data.className$></a> </td>
				</tr>
				<tr height="35">
					<td width="100">接口数量:</td>
					<td width="100"></td>
					<td><$=data.count$></td>
				</tr>
				<tr >
					<td width="100">url</td>
					<td width="100"></td>
					<td style="font-weight: 900;"><$=data.url$></td>
				</tr>
				<tr height="35">
					<td width="100">接口描述</td>
					<td width="100"></td>
					<td style="font-weight: 300;color: #2F4056;"><$=data.info$></td>
				</tr>	
				</table>
			</div>
			 
		 </div>
		 <hr style="margin-top: 20px;background-color: red;"/>
		 <div style="font-size:16px;margin-left: 10px;margin-top: 10px;"  >
		 	<table>
		 	<$for(var i=0;i<data.methods.length;i++){ $>
		 		<tr>
		 			<td width="100">方法名字</td>
		 			<td width="100"></td>
		 			<td><$=data.methods[i].methodName$></td>
		 		</tr>
		 		<tr>
		 			<td width="100">url</td>
		 			<td width="100"></td>
		 			<td style="font-weight: 900;"><$=data.methods[i].url$> </td>
		 		</tr>
		 		<tr>
		 			<td width="100">请求方式</td>
		 			<td width="100"></td>
		 			<td style="font-weight: 500;"><$=data.methods[i].methodRequest$>  </td>
		 		</tr>
		 		<tr>
		 			<td width="100">return</td>
		 			<td width="100"></td>
		 			<td style="color: red;font-weight: 500;"><$=data.methods[i].returnClassName$>  </td>
		 		</tr>
		 		 <tr>
		 			<td width="100">参数数量</td>
		 			<td width="100"></td>
		 			<td style="color: red;font-weight: 500;"><$=data.methods[i].parametBeans.length$>  </td>
		 		</tr>
			  	<tr height="40" align="top">
		 			<td style="color:darkblue" width="100">方法描述</td>
		 			<td width="100"></td>
		 			<td style="font-weight: 300;color: #2F4056;"><$=data.methods[i].info$>   </td>
		 		</tr>
		 		<tr>
		 			<td style="color:darkblue" width="100">请求参数</td>
		 			<td width="100"></td>
		 			<td style="font-weight: 300;color: #2F4056;">  
		 				<button lay-filter="demo1" class="layui-btn layui-btn-primary layui-btn-sm" onclick="showInfoDialog('<$=data.url$>','<$=data.methods[i].url$>')"><i class="layui-icon layui-icon-search"></i></button>
		 			</td>
		 		</tr>
				<tr>
		 			<td style="color:darkblue" > </td>
		 			<td width="100"></td>
		 			<td  > 
		 				<table>
							<$for(var k=0;k<data.methods[i].parametBeans.length;k++){$>
								<tr height="30">
									<td><$=data.methods[i].parametBeans[k].name $></td>	
									<td width="100"> </td>	
									<td><$=data.methods[i].parametBeans[k].val $></td>	
									<td width="100"> </td>	
									<td><$=data.methods[i].parametBeans[k].info $></td>	
								</tr>
							<$}$>
						</table>
					 
		 			</td>
		 		</tr>		 
				<tr>
					<td colspan="3"><hr style="margin-top: 20px;"/></td>
					
				</tr>
			
		 	<$}$>
		 	</table>			
		 				
		 </div>
		
	</script>
	<script type="text/html" id="templeteInterfacesTest">
		<form action="<$=requestUrl$>" method="<$=data.methodRequest$>" id="frm-reg" target="_blank"> 
			<table >
				<tr>
					<td>request</td> <td width="100"></td>	<td><$=requestUrl$> </td> 			
				</tr>
				<tr >
					<td height="50"></td> <td></td> <td></td> 
				</tr>
				<$for(var i=0;i<data.parametBeans.length;i++){$>
					 <$if("javax.servlet.http.HttpServletRequest"!=data.parametBeans[i].val&&data.parametBeans[i].val!=null){$>
				<tr height="40">
					<td colspan="3" >
					<input type="text" disabled="disabled" value="<$=data.parametBeans[i].val$>" style="border: 0px;width: 300px;height: 30px;"/>
					<input type="text" disabled="disabled" value="<$=data.parametBeans[i].name$>" style="border: 0px ;height: 30px;"/>
					<span style="font-weight:700;margin-left: 10px;">
					  	<input value="" type="text" name="<$=data.parametBeans[i].name$>" style="border-left: 0px;border-right: 0px;border-top: 0px;width: 500px;height: 30px;" />	
					</span>
					</td>
				</tr>
					 <$}$> 	
				<$}$>
				  
				<tr height="50">
					<td colspan="3" align="center">
						<input type="submit" id="sub" onclick="submitInfo()" value="提交" />
					</td>
				</tr>
				
			</table> 
			
			</form>
			<input type="hidden" value="" id="paetn" />
	</script>
	<script type="text/javascript">
		layui.use('laydate', function() {
			var laydate = layui.laydate;
			//常规用法
			laydate.render({
				elem: '#test1',
				type: 'datetime',
				range: '-',
				format: 'yyyy:M:d H:m'
			});
				 //监听提交
		});
		
		 

		function getSrc(name) {
			var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
			var r = window.location.search.substr(1).match(reg);
			if(r != null) return unescape(r[2]);
			return null;
		}

		function createDataTable(array, pageData) {
			layui.use('table', function() {
				var table = layui.table;
				table.render({
					elem: '#test'
						// ,url:'../dataMachiningController/queryDataCounts.zt'
						,
					cellMinWidth: 100 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
						,
					skin: 'line',
					cols: [
						[ 
							{
								field: 'url',
								title: '路径',
								style: 'height:70px'
							} 
						]
					],
					limit: pageData.limit,
					data: array,
					page: {
						layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
							,
						count: pageData.count,
						limit: pageData.limit,
						limits: pageData.sele
						// ,theme:"pageAlign" //生成layui-laypage-pageAlign 会在这个分页上加一个这样的类
						//,curr: 5 //设定初始在第 5 页
						//,groups: 1 //只显示 1 个连续页码
						// ,last: false //不显示尾页
					}
				});
				var ins = 0;
				table.on('checkbox(test)', function(obj) {
					// console.log(obj.checked); //当前是否选中状态
					var checkeds = obj.checked;
					if(obj.type == "all") {
						if(checkeds) {
							ins = 100;
						} else {
							ins = 0;
						}
					} else {
						var application = obj.data.application;
						var intApplication = parseInt(application);
						if(checkeds) {
							ins += intApplication;
						} else {
							ins -= intApplication;
						}
					}
					//console.log(obj.data); //选中行的相关数据
					//console.log(obj.type); //如果触发的是全选，则为：all，如果触发的是单选，则为：one
					addDocument(ins);
				});
			});
		}

		function head() {
			var areaId = getSrc("areaId")
			var area = "";
			for(var i = 0; i < province.data.length; i++) {
				var index = province.data[i].index
				if(areaId == index) {
					area = province.data[i].value;
				}
			}
			var datas = {
				data: area
			};
			console.log(datas);
			var html = template('templateHead', datas);
			document.getElementById('headDiv').innerHTML = html;
		}

		function addDocument(num) {
			var applicationNum = document.getElementById('applicationNum');
			applicationNum.innerHTML = num;
		}

		var paramterUrl = "D:/DevelopTools";
		var ip = "192.168.18.10"; //"47.100.32.85" //192.168.18.10
		var ip1="192.168.18.154";
		function showList() {
			var url = "http://" + ip1 + ":8080/yp-resource/tomcatLogInfoController/getAllUrl";
			
			$.getJSON(url +  "?ypcollBack=?&saltEC=lgMxEb1UcEwBmHwSwQ9j8UviIOJdhD7MR9uygiFAs8o=", function(data, status) {
				 showInofDataTemplate(data,status);
			});
		}
		
		
		function showInofDataTemplate(data,status){
				var array = new Array();
				if(data.scaUrl.length < 1 || status != "success") {
					var arr = {
						"url": "<a href='javascript:(0)'  id='url_" + i + "' style='color:blue;'>暂无数据</a>" 
					};
					array.push(arr);
				}
				for(var i = 0; i < data.scaUrl.length; i++) {
					var str = data.scaUrl[i];
					var urlStr="";
					var enStr="";
					if(str!=null){
							  urlStr=str.url.replace(/\//g,"<span style='color:red'> /</span>");
							  urlStr+="   ";
							  enStr=str.url.replace(/\//g,"~");
					}
					 var str1="<a href='javascript:(0)' ";
					 var str2="onclick=showBean('"+enStr+"')";
					 var str3=" id='url_" + i + "'  style='color:black;font-size:18px;'><b>" + urlStr + "</b></a>";
					var arr = {
						"url": str1+str2+str3 
					};
					array.push(arr);
				}
				var pageData = {
					count: array.length,
					limit: 8,
					sele: [10, 20, 30, 40, 50, 60, 70, 80, 90, 100]
				};
				createDataTable(array, pageData);
		}
		
		function showBean(baseUrl){
			var url = "http://" + ip1 + ":8080/yp-resource/tomcatLogInfoController/getUrl";
			$.getJSON(url +  "?ypcollBack=?&saltEC=lgMxEb1UcEwBmHwSwQ9j8UviIOJdhD7MR9uygiFAs8o=&baseUrl="+baseUrl, function(data, status) {
					if(data!=null&&data.bean!=null){
						var objectVal={
						data:data.bean
						};
						console.log(objectVal);
						var html1 = template('templetBean', objectVal);
		 		 		document.getElementById("HtmlBean").innerHTML = html1;
					}else{
						document.getElementById("HtmlBean").innerHTML = "暂无数据";
					}
					
			});
		}

		function topUrl(urlid) {
			var url = $("#url_" + urlid).text();
			var arr = url.split("/");
			var str = "";
			console.log(arr)
			if(arr.length > 2) {
				for(var i = 0; i < arr.length - 2; i++) {
					str += arr[i] + "/";
				}
			} else {
				return false;
			}
			paramterUrl = str;
			showList();
		}

		function nextUrl(urlid) {
			var url = $("#url_" + urlid).text();
			paramterUrl = url;
			showList();
		}
		
		function showInfoDialog(clsUrl,methodUrl){
			var requestUrl="http://" + ip1 + ":8080/yp-resource"+clsUrl+"/"+methodUrl;
			clsUrl=clsUrl.replace(/\//g,"~" );
			methodUrl=methodUrl.replace(/\//g,"~" );
		 	var url = "http://" + ip1 + ":8080/yp-resource/tomcatLogInfoController/getUrlCls";
			
			$.getJSON(url +  "?baseUrl="+clsUrl+"&methodUrl="+methodUrl+"&ypcollBack=?&saltEC=lgMxEb1UcEwBmHwSwQ9j8UviIOJdhD7MR9uygiFAs8o=", function(data, status) {
			 	console.log(data)
			 	var objectVal={
			 		data:data.bean,
			 		requestUrl:requestUrl
			 	};
			 	
			 	var html1 = template('templeteInterfacesTest', objectVal);
		 		document.getElementById("interfacesTest").innerHTML = html1;
		 		
			 	layer.open({type:1,content:$('#interfacesTest').html(), area: ['70%', '70%'],title: ['接口测试', 'font-size:16px;']});
			 		
			 		
			 });
		}
		
		function searchInfo(){
			
			var searInfo= $("#searchAs").val();
			searInfo=searInfo.replace(/\//g,"~" );
			
		 	var url = "http://" + ip1 + ":8080/yp-resource/tomcatLogInfoController/searchBeans";
		 	$.getJSON(url +  "?search="+searInfo+"&ypcollBack=?&saltEC=lgMxEb1UcEwBmHwSwQ9j8UviIOJdhD7MR9uygiFAs8o=", function(data, status) {
		 		 showInofDataTemplate(data,status);
			});
		}
		function seachsKey(even){
			var e = event || window.event || arguments.callee.caller.arguments[0];
 			 if(e!=null&&e.keyCode==13){
 			 	searchInfo();
 			 }
		}
		function submitInfo(){
			 
		}
		  
		head();
		showList();
		showBean("/businessMessage");
		
	</script>

</html>